<!DOCTYPE html>
<html>

	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<title></title>
		<link rel="stylesheet" type="text/css" href="../css/common.css?01_38" />
		<link rel="stylesheet" type="text/css" href="../css/templet.css?01_38" />
		<link rel="stylesheet" type="text/css" href="../fonts/font-awesome.min.css?01_38" />
		<link rel="stylesheet" type="text/css" href="../mui/css/mui.css?01_38" />

		<!--公共js-->
		<script type="text/javascript" src="../common/js/jquery.js?01_38"></script>
		
		<!--插件-->
		<script type="text/javascript" src="../common/js/vue.min.js?01_38"></script>
		<script type="text/javascript" src="../common/js/mui.min.js?01_38"></script>
		
		<script type="text/javascript" src="../common/js/fastclick.js?01_38"></script>
		<script type="text/javascript" src="../common/js/common.js?01_38"></script>
		<script type="text/javascript" src="../common/js/my_common.js?01_38"></script>
		<script type="text/javascript" src="../common/js/main.js?01_38"></script>
		<script type="text/javascript" src="../common/js/app.js?01_38"></script>
	</head>

	<body>
		<header class="bg-red9 fff f-20 pad-t-10 pad-b-25 pad-l-10 pad-r-10">
			<div onclick="cli_backpre()" class="pa back">
				<a></a>
			</div>
			<div class="center" data-l="1069"></div>
		</header>
		<div id="app" v-cloak>
			<div v-if="loader" class="wrap_body vip_card_infor bg-grayF5">

				<span class="bg-green pr pad-3 pad-l-10 pad-r-10 f-12 fr fff" v-if="info.status == 1">{{b_lg['1360']}}</span>
				<span class="bg-yellow pr pad-3 pad-l-10 pad-r-10 f-12 fr fff" v-else-if="info.status == 2">{{b_lg['1348']}}</span>
				<span class="bg-grayf4 pr pad-3 pad-l-10 pad-r-10 f-12 fr" v-else>{{b_lg['1361']}}</span>
				<div class="content pad-t-45">
					<div class="bg-fff pad-t-15 pad-l-12 pad-r-12">
						<div class="bg pad-15 fff" :style="bgstyle(info.color,info.thumb)">
							<div class="fiex">
								<div><img :src="info.headimgurl" alt="" /></div>
								<div class="pad-l-12">
									<p class="f-20">{{info.name}}</p>
									<p class="f-12">{{info.card_name}}</p>
								</div>
							</div>
							<div class="bank40"></div>
							<div>
								<p class="f-16">{{info.sn}}</p>
								<p class="f-10 pad-t-10">{{info.level_name}}</p>
							</div>
							<div class="bank20"></div>
						</div>
						<div class="bank20"></div>
						<div class="cf center info">
							<div class="col-sm-4 wrap pad-l-10 pad-r-10" @click="gotoart('vipGoldDetail.html')">
								<p class="yellow f-20">{{info.point}}</p>
								<p class="fiex"><span class="vbg bg_01"></span><span class="fiex1">{{b_lg['1369']}}</span></p>
							</div>
							<div class="col-sm-4 wrap pad-l-10 pad-r-10" @click="gotoart('vipBalanceDetail.html')">
								<p class="green f-20">{{info.amount}}</p>
								<p class="fiex"><span class="vbg bg_02"></span><span class="fiex1">{{b_lg['1364']}}</span></p>
							</div>
							<div class="col-sm-4 wrap pad-l-10 pad-r-10">
								<p class="purple f-20" v-if="languageStyle == 'zh'">{{info.level_discount}}%</p>
								<p class="purple f-20" v-else>{{100-info.level_discount}}% off</p>
								<p class="fiex"><span class="vbg bg_03"></span><span class="fiex1">{{b_lg['1096']}}</span></p>
							</div>
						</div>
						<div class="bank20"></div>
					</div>
					<div class="bank15"></div>

					<div class="f-16 bg-fff pad-l-12">
						<div class="list fiex pad-t-20 pad-b-20 pad-r-12" @click="gotoart('vipCardAlter.html')">
							<div class="fiex1">{{b_lg['1363']}}／{{b_lg['1364']}}</div>
							<div class="rbg"></div>
						</div>
						<div class="list fiex pad-t-20 pad-b-20 pad-r-12" @click="gotoart('vipUserinfo.html')">
							<div class="fiex1">{{b_lg['1365']}}</div>
							<div class="rbg"></div>
						</div>
						<div class="list fiex pad-t-20 pad-b-20 pad-r-12" @click="gotoart('vipGoldDetail.html')">
							<div class="fiex1">{{b_lg['1366']}}</div>
							<div class="rbg"></div>
						</div>
						<div class="list fiex pad-t-20 pad-b-20 pad-r-12" @click="gotoart('vipBalanceDetail.html')">
							<div class="fiex1">{{b_lg['1367']}}</div>
							<div class="rbg"></div>
						</div>
					</div>
					<div class="bank30"></div>
					<div v-if="info.status == 1 || info.status == 3">
						<div class="center">
							<a class="pad-l-70 pad-r-70 pad-t-10 pad-b-10 btn bg-000 fff f-16" @click="setstart(3)" v-if="info.status == 1">{{b_lg['1361']}}</a>
							<a class="pad-l-70 pad-r-70 pad-t-10 pad-b-10 btn bg-yellow fff f-16" @click="setstart(1)" v-else>{{b_lg['1362']}}</a>
						</div>
					</div>
					<div v-else>
						<div class="fiex pad-l-12 pad-r-12 center">
							<div class="pad-l-12 pad-r-12 fiex1">
								<a class="pad-t-10 pad-b-10 btn bk btn_02 f-16" @click="setstart(3)">{{b_lg['1346']}}</a>
							</div>
							<div class="pad-l-12 pad-r-12 fiex1">
								<a class="pad-t-10 pad-b-10 btn btn_03 bg-fa9 fff bk f-16" @click="setstart(1)">{{b_lg['1368']}}</a>
							</div>
						</div>
					</div>
					<div class="bank30"></div>

				</div>
			</div>
			<!--接口未加载完成界面-->
			<div v-else>
				<div class="mask bg-000 pa loading">
					<div class="pad-l-40 pad-r-40 pad-t-200">
						<div class="bg-fff wrap pr center ">
							<img src="../images/default_graph/animation.gif" />
						</div>
					</div>
				</div>
			</div>
		</div>

	</body>

	<script type="text/javascript">
		var app = null;
		var getSn = getQueryString("sn");
		var phoneNumber = getQueryString("couponSn");
		var getID = getQueryString("id");
		function cli_backpre(){
			app.backpre()
		}
		//id为1时，是从会员卡记录进来的
		//id为2时，是从扫码页进来的
		function refresh() {
			app.init();
		}

		function plusReady() {}
		if(window.plus) {
			plusReady();
		} else {
			document.addEventListener('plusready', plusReady, false);
		}

		// 关闭自身窗口
		function closeme() {
			if(isAPP) {
				var ws = plus.webview.currentWebview()
				plus.webview.close(ws)
			} else {
				back()
			}

		}
		// 关闭父层窗口
		function closepre() {
			if(isAPP) {
				var preUrl = plus.webview.currentWebview().opener();
				var ws = plus.webview.currentWebview();
				plus.webview.close(ws);
				plus.webview.close(preUrl);
			} else {
				back()
			}

		}

		function fun1() {
			setlange_obj(); //加载头部语言包
			down_load() //开启下拉刷新
			app = new Vue({
				el: "#app",
				data: {
					b_lg: global_lange, //语言包
					id: "",
					info: {},
					btn: "禁用",
					s: "",
					loader: false,
					languageStyle:getItem("lg")
				},
				mounted: function() {
					this.init()
				},
				methods: {
					init: function() {
						common_ajax(1, {
							sn: getSn,
							mobile: phoneNumber
						}, "get_card_info_by_mobileSn", function(res) {

							if(res.status == 1) {
								app.id = res.result.info.id;
								common_ajax(1, {
									id: app.id
								}, "get_member_card_member_info", function(res) {
									if(res.status == 1) {
										app.info = res.result.info;
										localStorage.setItem("id", app.info.id);
										localStorage.setItem("card_id", app.info.card_id);
										app.loader = true
									} else {
										mui.toast(res.msg);
									}
								})
							} else {
								mui.toast();

							}

						})

					},
					gotoart: function(e) {
						clicked(e);
					},
					setstart: function(st) {
						var st = st;

						var txt = ""
						switch(st) {
							case 1:
								txt = "确定要启用该会员卡吗?";
								break;
							case 3:
								txt = "确定要禁用该会员卡吗?";
								break;
							case 4:
								txt = "确定要拒绝会员卡申请吗?";
								break;
							default:
								break;
						}
						var btnArray2 = [app.b_lg[1049], app.b_lg[1008]];
						mui.confirm(txt, app.b_lg[1050], btnArray2, function(ee) {
							if(ee.index == 1) {
								//确定
								common_ajax(1, {
									id: app.id,
									status: st
								}, "set_member_card_status", function(e) {
									if(e.status == 1) {
										//刷新
										app.init();

										if(isAPP) {
											var preUrl = plus.webview.currentWebview().opener();
											preUrl.evalJS('refresh()')
										}
									} else {
										mui.toast(e.msg);
									}
								})
							} else {
								//取消
								app.init();
							}
						},"div")

					},
					//会员卡背景图
					bgstyle: function(s1, s2) { //返回style

						if(s2 == "") {
							var bgimg = "../images/color1.jpg"
							switch(s1) {
								case "#f68939":
									bgimg = "../images/color1.jpg"
									break;
								case "#1d47cb":
									bgimg = "../images/color2.jpg"
									break;
								case "#682697":
									bgimg = "../images/color3.jpg"
									break;
								case "#0f90e9":
									bgimg = "../images/color4.jpg"
									break;
								case "#1b212d":
									bgimg = "../images/color5.jpg"
									break;
								case "#1fa515":
									bgimg = "../images/color6.jpg"
									break;
								case "#cb3217":
									bgimg = "../images/color7.jpg"
									break;
								case "#22b94c":
									bgimg = "../images/color8.jpg"
									break;
								case "#5d62f4":
									bgimg = "../images/color9.jpg"
									break;
								case "#049ff9":
									bgimg = "../images/color10.jpg"
									break;
								default:
									bgimg = "../images/color1.jpg"
									break;
							}
							return "background-image:url(" + bgimg + ")";
						} else {
							return "background-image:url(" + s2 + ")";
						}
					},
					backpre: function() {
						if(getID == 1) {
							if(isAPP) {
								var preUrl = plus.webview.currentWebview().opener();
								preUrl.evalJS("refresh()");
							}
							com_back();
						} else {
							closepre();
						}
					}
				}

			})
		}
	</script>

</html>
